<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition template="./../home.xhtml"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui">
    <ui:define name="content" >
        <p:growl  id="msgGrowl"  />
        <div class="col-lg-12">
            <h3 class="page-header" id="perros">
                Administración de Canes
            </h3>
        </div>
        <div class="row">
            <div class="col-lg-12">
                <h:form id="frmFiltroPerro" styleClass="form-horizontal">
                    <p:panel header="Busqueda de Canes" styleClass="panel panel-primary" toggleable="true" toggleSpeed="300">
                        <div class="row">
                            <div class="col-md-12" >
                                <div class="col-md-1" style="width: 10.733333333333332%;text-align: right;" >
                                    <label class="control-label" style="font-weight: normal;" for="startTime">Can:</label>
                                </div>
                                <div class="col-md-4" style="margin-right: -45px;margin-left: -5px;"  >
                                    <p:inputText value="#{perroBean.perroFiltro.nombre}" />
                                </div>
                                <div class="col-md-1" style="width: 10.733333333333332%;text-align: right;" >
                                    <label class="control-label" style="font-weight: normal;" for="startTime">Raza:</label>
                                </div>
                                <div class="col-md-4" style="margin-left: -5px;"  >
                                    <h:selectOneMenu value="#{perroBean.perroFiltro.idRaza}" styleClass="form-control" >
                                        <f:selectItem itemValue="0" itemLabel="Seleccionar" />
                                        <f:selectItems value="#{perroBean.razas}" var="razas" itemValue="#{razas.id}" itemLabel="#{razas.descripcion}" />
                                    </h:selectOneMenu>
                                </div>
                            </div>
                        </div>

                        <div class="row" >
                            <div class="col-md-12" >
                                <fieldset class="scheduler-border">
                                    <legend class="scheduler-border">Fecha de Nacimiento</legend>
                                    <div class="col-md-1" style="width: 10.733333333333332%;">
                                        <label class="control-label" style="font-weight: normal;" for="startTime">Desde:</label>
                                    </div>
                                    <div class="col-md-4" style="margin-left: -25px;" >
                                        <p:calendar locale="es" navigator="true" value="#{perroBean.perroFiltro.dateMin}" pattern="dd/MM/yyyy" maxdate="#{perroBean.perroFiltro.fechaInicial}" readonlyInput="true" />
                                    </div>
                                    <div class="col-md-1" style="width: 10.733333333333332%;">
                                        <label class="control-label" style="font-weight: normal;" for="startTime">Hasta:</label>
                                    </div>
                                    <div class="col-md-4" style="margin-left: -25px;" >
                                        <p:calendar locale="es" navigator="true" value="#{perroBean.perroFiltro.dateMax}" pattern="dd/MM/yyyy" maxdate="#{perroBean.perroFiltro.fechaInicial}" readonlyInput="true"  />
                                    </div>
                                </fieldset>
                            </div>
                        </div>
                        <p:panelGrid columns="2">
                            <h:commandButton styleClass="btn btn-primary" value="Buscar" actionListener="#{perroBean.buscarFiltro}">
                                <f:ajax execute="@form" render=":listPerros :msgGrowl" />
                            </h:commandButton>
                            <h:commandButton styleClass="btn btn-primary" value="Limpiar" actionListener="#{perroBean.limpiarFiltro}">
                                <f:ajax execute="@form" render=":listPerros :frmFiltroPerro :msgGrowl" />
                            </h:commandButton>
                        </p:panelGrid>                        
                    </p:panel>  
                </h:form>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <div class="panel-body">
                        <h:form id="listPerros">
                            <f:event type="preRenderView" listener="#{perroBean.initLista}" />
                            <p:dataTable value="#{perroBean.perros}" var="list" 
                                         paginator="true" rows="10" lazy="true" rowIndexVar="rowIndex" emptyMessage="No existen registros de Canes"
                                         paginatorTemplate="{RowsPerPageDropdown} {FirstPageLink} {PreviousPageLink} {CurrentPageReport} {NextPageLink} {LastPageLink}" >

                                <f:facet name="header">
                                    <h:commandLink styleClass="btnExportarExcel"  actionListener="#{perroBean.exportar}">
                                        <h:graphicImage value="/resources/image/xls.gif" />
                                    </h:commandLink>
                                </f:facet>
                                <p:column style="text-align: center;width: 6%;">
                                    <f:facet name="header">
                                        #
                                    </f:facet>
                                    <h:outputText value="#{rowIndex+1}" />
                                </p:column>
                                <p:column headerText="Nombre" style="text-align: center;font-size: 15px;">
                                    <h:outputText value="#{list.nombre}" />
                                </p:column>
                                <p:column headerText="Color" style="text-align: center;font-size: 15px;">
                                    <h:outputText value="#{list.color.nombreColor}" />
                                </p:column>
                                <p:column headerText="Raza" style="text-align: center;font-size: 15px;">
                                    <h:outputText value="#{list.raza.descripcion}" />
                                </p:column>
                                <p:column headerText="Fecha de nacimiento" style="text-align: center;font-size: 15px;width: 20%;">
                                    <h:outputText value="#{list.fechaNacimiento}" >
                                        <f:convertDateTime pattern="dd/MM/yyyy" />
                                    </h:outputText>
                                </p:column>
                                <p:column style="width: 10%;">
                                    <h:panelGroup rendered="#{usuarioBean.permiso.actualizar eq true}">
                                        <p:commandButton icon="icon-update" action="#{perroBean.irActualizar(list.id)}" style="font-size: 12px;" />
                                    </h:panelGroup>
                                    <h:panelGroup rendered="#{usuarioBean.permiso.eliminar eq true}">
                                        <p:commandButton icon="icon-delete" title="Eliminar" actionListener="#{perroBean.prepararEliminar(list.id)}" oncomplete="dlgCan.show();"  style="font-size: 12px;" />

                                    </h:panelGroup>

                                </p:column>

                            </p:dataTable>
                        </h:form>
                        <p:spacer width="30px"/>
                        <h:panelGroup rendered="#{usuarioBean.permiso.crear eq true}">
                            <h:form id="frmIr">
                                <h:button styleClass="btn btn-primary"  value="Nuevo Can" outcome="create.xhtml" />
                            </h:form>
                        </h:panelGroup>

                    </div>
                </div>
            </div>
        </div>
        <p:dialog modal="true" maximizable="false" widgetVar="dlgCan" header="Eliminar Registro">
            <p>¿Desea eliminar al Can?</p>
            <h:form id="frmEliminar">
                <p:commandButton value="Aceptar" actionListener="#{perroBean.eliminarPerro}" update=":listPerros,:msgGrowl" oncomplete="dlgCan.hide();" />
                <p:commandButton value="Cancelar" oncomplete="dlgCan.hide();" />
            </h:form>
        </p:dialog>
    </ui:define>
</ui:composition>

